var map, polyline, rpolyline;
var   marker = new google.maps.Marker({map: map, position: point });
var gpoints = [];
var marker_point = [];
        var html = [];
        var point = [];
        var imei = [];
        var intervalId = [];
        var tmp = [];

  function initialize() {
    var myLatlng = new google.maps.LatLng(51.1657, 10.4515);
    var myOptions = {
      zoom: 4,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
 
document.map = map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

 //NAVIGATION
    var sv = document.createElement('Save');
    var st = document.createElement('Start');
    var stp = document.createElement('Stop');
    
    var saveControl = new Save(map, sv);
    saveControl.index = 1;
    var startControl = new Start(map, st);
    startControl.index = 1;
    var stopControl = new Stop(map, stp);
    stopControl.index = 1;
    
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(sv);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(st);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(stp);

}
 $(document).ready(function(){
    
 
//отображение всего маршрута при активном checkbox
$('#imei input[type="checkbox"]').bind('click', function () {

if($(this).attr("checked")) {
//получаем массив активных checkbox
imei.push($(this).val());

for(var i = 0; i < imei.length; i++) {
     tmp[i] = imei[i];
 //мониторим в реальном времени
 realTimeID =  setInterval(function(){
         $.getJSON("/ajax/getlastpoint", {imei:tmp}, function(data){
         //обработчик результатов запроса
         setMarkerRealTime(data, imei[i]);
     });
         
     }, 5000); 
     imei.shift();
     var hash = {tmp:realTimeID};
     intervalId.push(hash);
}

for(var j in intervalId) {
alert(intervalId[j].tmp);
alert(tmp[j]);
}
//var keys = [];
/*$.each(intervalId[0], function(key,val){ keys.push(key); });
alert(keys);
alert(intervalId[0].tmp);
*/
     //обновляем базу дунных на сервере
 //    saveGpsDataID = setInterval(function(){saveGpsData()}, 5000);
 
}

else {
//hide(markersType); //нужно реализовать
//останавливаем мониторинг в реальном времени
clearInterval(realTimeID);
//imei = null;
//останавливаем обновление точек 
//clearInterval(saveGpsDataID);
//hide(imei);
//удаляем маркер
marker.setMap(null);
}
});


 
    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;
 
      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };
 
      request.open('GET', url, true);
      request.send(null);
    }
   }); //end ready
    function doNothing() {}      
        
        //устанавливаем маркер в реальном времени и соединяем линией
        function setMarkerRealTime(data) {
  
	var infoWindow = new google.maps.InfoWindow;	 

	for(var i = 0; i < data.points.length; i++) {
           
        	
    	marker_point[i] = new google.maps.LatLng(data.points[i].latitude, data.points[i].longitude);	
	html[i] = '<strong>Speed: '+data.points[i].speed+'km</strong><br /><strong>Battery: '+data.points[i].battery+'%</strong><br />'+'<strong>Time: '+data.points[i].date+'</strong>';
        icon = data.points[i].mimg;
	createMarker(marker_point[i], html[i], icon, infoWindow);        
        }        


   
  }//end setMarkerRealTime


function createMarker(point, html, icon, infoWindow) {

            marker.setMap(null);

          marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: '../../uploads/gps/car.png' //+icon //+icon.icon
           // shadow: icon.shadow           
          });

  google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
  gpoints.push(marker);
  return marker;
}


$('#view').click(function(){
     getAllPoints();
 });

 

//  }); //end ready

function saveGpsData() {
     data = 'test';
     $.ajax({
         type: "POST",
         url: "savegpsdata",
         data: data
    }); 
 }

function saveRoute(imei) {
    var data = 'imei=' + imei; 
    $.ajax({
        type: "POST",
        url: "saveroute",
        data: data,
        complete: function() {
            alert('Route saved');
        }
    });
}

function Save(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';
        controlDiv.style.background = 'url(/img/save6245.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        //controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'blue';  
        controlDiv.style.fontSize = '15px'; 
        controlDiv.style.margin = '0px 5px 0px 0px';

        //SAVE ROUTE
	//var saveRouteUI = document.createElement('save');
	//saveRouteUI.title = 'click save route';
	//controlDiv.appendChild(saveRouteUI);

	//var saveRouteText = document.createElement('save');
	//saveRouteText.innerHTML = 'Save route';
	//saveRouteUI.appendChild(saveRouteText);
        
        

	// Установка обработчика событий для кнопки save
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//получаем imei выбранного чекбокса
                //var imei = $("input[type=checkbox]:checked").val();
                //if (imei != null) {
                    //saveRoute(imei);
               // } else {
                //    alert('Please, select a car!');
               // }
        });
}


function Start(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';
        controlDiv.style.background = 'url(/img/player_start_9486.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'red';
        controlDiv.style.fontSize = '15px';       
        controlDiv.style.margin = '0px 5px 0px 5px';
      
        //START TRACKING        
        //var startTrackingUI = document.createElement('start');
	//startTrackingUI.title = 'Click to start tracking';
	//controlDiv.appendChild(startTrackingUI);

	//var startTrackingText = document.createElement('start');
	//startTrackingText.innerHTML = '';
	//startTrackingUI.appendChild(startTrackingText);

        // Установка обработчика событий для кнопки start:
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//some action
               //saveGpsDataID = setInterval(function(){saveGpsData()}, 5000);
                //show(imei);
	});
}

function Stop(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';        
        controlDiv.style.background = 'url(/img/stop2675.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'red';
        controlDiv.style.fontSize = '15px';       
        controlDiv.style.margin = '0px 0px 0px 5px';
        controlDiv.id = 'stop';
        
        //STOP TRACKING
	//var stopTrackingUI = document.createElement('stop');
	//stopTrackingUI.title = 'Click to stop tracking';
	//controlDiv.appendChild(stopTrackingUI);

	//var stopTrackingText = document.createElement('stop');
        //stopTrackingText.innerHTML = 's';
	//stopTrackingUI.appendChild(stopTrackingText);

       
	// Установка обработчика событий для кнопки stop:
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//some action

                //останавливаем проложение маршрута в реальном времени
                //if(realTimeID)
                //clearInterval(realTimeID);
                
                //останавливаем обновление точек
                //if(saveGpsDataID)
                //clearInterval(saveGpsDataID);
                //скрываем маршрут
                //hide(imei);
	});
}

function test(){
    alert('test');
}
/*
//скрываем элементы с карты
 function hide(imei) {
        //скрываем маркеры с карты
        for (var i = 0; i<gpoints.length; i++) {
            gpoints[i].setMap(null); 
        } 
        //удаляем маркеры после скрытия
        gpoints.length = 0;
        //делаем checkbox не активным
    //    document.getElementById(imei+"-imei").disabled = true;
    //    document.getElementById(imei+"-imei").checked = false;
        // == close the info window, in case its open on a marker that we just hid
        //infowindow.close();
      } //end hide
 
 //отображаем элементы на карте     
 function show(imei) {
    for (var i = 0; i<gpoints.length; i++) {
          gpoints[i].setMap(map); 
        } 

        for (var j = 0; j < rpolyline.length; j++){
        rpolyline[j].setMap(map);
        }
        
         //мониторим в реальном времени
 realTimeID =  setInterval(function(){
         $.getJSON("/ajax/getlastpoint", {imei:imei}, function(data){
         //обработчик результатов запроса
         setMarkerRealTime(data, imei);
         

     });
         
     }, 5000);
        //делааем checkbox активным
        document.getElementById(imei+"-imei").disabled = false;

     //   document.getElementById(imei+"-imei").checked = true;
      } // end show
     */ 
	  
$(function() { 
    $("#addimei").click(function() {                                
        var imei = $("#imei").val();               
        var name = $("#name").val();
        var category = $('#category').val();       
        //var img  = $('#img').val();            //CKEDITOR.instances['editor1'].getData();        
        var data ='imei='+imei+'&name='+name+'&category='+category;
	        // делаем ajax запрос
        $.ajax({
            type: "POST",
            url: "/ajax/newcar",
            data: data,            
            complete: function() {
                alert('Car added');
                $.getJSON("/ajax/getallcars", {imei:imei}, function(data){
         //обработчик результатов запроса
         getAllCars(data);
    });
            }
        });
        $.ajax({
            type: "POST",
            url: "/ajax/getallcars",
            data: data,            
            complete: function() {                
            }
        });        
    });
});

function getAllCars(data) {
        var i = data.cars.length -1;
        $('#test2').append('<table border="1"><tr><td>Show</td><td width=\"100px\" max-width=\"100px\">Name</td>'                         
        + '<td width=\"50px\">Save </td></tr><tr><td><input id="'+data.cars[i].imei+'" type="checkbox" value="'+data.cars[i].imei+'" /></td>'
        + '<td>'+data.cars[i].name+'<br /><img src="/uploads/gps/car.png" /></td>'
        + '<td><input type="button" class="button" name="button" id="'+data.cars[i].imei+'" style="width: 55px;" value="Save" onclick="" /></td>'                     
        + '</tr></table>');
}